

import loginDialog from './loginDialog.vue'

import { createApp, onMounted } from 'vue'

//挂载
let dialogInstance = null;
//真正dom
let dialogElement = null;


export default {
  install: (app, options) => {
    //注册成全局组件
    app.component('loginDialog', loginDialog);
    // 注入一个全局可用的 $translate() 方法
    app.config.globalProperties.$LoginDialogShow = (key) => {
      // console.log('LoginDialogShow');

      if (!dialogInstance) {
        // console.log('安装');
        // 创建一个dom
        dialogElement = document.createElement('div')
        // 把dom绑定到 body上
        document.body.appendChild(dialogElement)
        // 创建vue实例
        dialogInstance = createApp(loginDialog)
        // 挂载
        dialogInstance.mount(dialogElement)
      }else{
          console.log('卸载');
          // dialogInstance.unmount()
          // document.body.removeChild(dialogElement)
          // dialogInstance = null
          // dialogElement = null
      }
      return dialogInstance
    }

    // 关闭
     // Global method to hide the login dialog (unmount)
     app.config.globalProperties.$LoginDialogHide = () => {
      console.log('LoginDialogHide123');
      
      if (dialogInstance && dialogElement) {
        // Unmount the Vue instance
        dialogInstance.unmount()

        // Remove the dialog element from the DOM
        document.body.removeChild(dialogElement)

        // Reset instances to allow for re-mounting later
        dialogInstance = null
        dialogElement = null

        console.log('销毁弹框');
        
      }
    }
  }
}